<!--
	开发者:宋成恩
	开发时间:2017-7-9
	修改时间:2017-7-9
	功能:个人用户修改简历中的求职意向,单独的表单组件 ../PersonResume.vue中调用
 -->
<template>
  <div id="resumeCareerObjectiveForm">
    <el-form :model="careerObjectiveFormInfo" :rules="careerObjectiveInfoRules" ref="careerObjectiveInfoForm"
             label-width="120px">
      <el-row>
        <el-col :span="7">
          <el-form-item label="期望职业1：" prop="position_name1">
            <el-input v-model="careerObjectiveFormInfo.position_name1" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="工作性质：" prop="work_type">
            <el-select v-model="careerObjectiveFormInfo.work_type" size="small" style="width: 100%;">
              <el-option v-for="(optionitem,index) in workTypeList" :key="index" :label="optionitem.label"
                         :value="optionitem.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="期望工作地点：" prop="place_names">
            <el-cascader change-on-select v-model="careerObjectiveFormInfo.place_names" :options="placeList"
                         style="width: 100%" :props="prop"></el-cascader>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="期望职业2：" prop="position_name2">
            <el-input v-model="careerObjectiveFormInfo.position_name2" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="最低薪资(元)：" prop="expected_min_salary">
            <el-input-number :controls="false" v-model="careerObjectiveFormInfo.expected_min_salary" size="small"
                             style="width:100%"></el-input-number>
          </el-form-item>
          <el-form-item label="求职状态：" prop="status">
            <el-select v-model="careerObjectiveFormInfo.status" size="small" style="width: 100%;">
              <el-option v-for="(optionitem,index) in statusList" :key="index" :label="optionitem.label"
                         :value="optionitem.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="期望职业3：" prop="position_name3">
            <el-input v-model="careerObjectiveFormInfo.position_name3" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="最高薪资：" prop="expected_max_salary">
            <el-input-number :controls="false" v-model="careerObjectiveFormInfo.expected_max_salary" size="small"
                             style="width:100%"></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="btn-box">
      <el-button type="info" size="large" @click="checkCareerInfoData">保存</el-button>
      <el-button type="info" size="large" @click="cancelCareerInfoEdit">取消</el-button>
    </div>
  </div>
</template>

<script>
  import { postDataToServer } from '../../../assets/js/post.js'
  import { getStaticMapList } from '../../../assets/js/GlobeDefine.js'
  import { province } from '@/assets/js/placeList.js'

  export default {
    name: 'resumeCareerObjectiveForm',
    props: ['resumeId', 'careerId'],
    data () {
      return {
        placeList: province(),
        careerObjectiveFormInfo: {
          position_name1: '',
          position_name2: '',
          position_name3: '',
          work_type: 0,
          place_name: '',
          place_names: [],
          expected_max_salary: 0,
          expected_min_salary: 0,
          status: 0
        },
        careerObjectiveInfoRules: {
          position_name1: [
            {required: true, message: '请填写您的期望职业', trigger: 'blur'},
            {min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'change'}
          ],
          position_name2: [
            {min: 0, max: 120, message: '最多可填写120个汉字', trigger: 'change'}
          ],
          position_name3: [
            {min: 0, max: 120, message: '最多可填写120个汉字', trigger: 'change'}
          ],
          place_names: [
            {type: 'array', min: 0, max: 60, message: '最多可填写60个汉字', trigger: 'blur'}
          ],
          expected_min_salary: [
            {required: true, type: 'number', message: '请填写您的最低期望薪资', trigger: 'change'},
          ],
          expected_max_salary: [
            {required: true, type: 'number', message: '请填写您的最高期望薪资', trigger: 'change'},
          ],
        },
        prop: {
          value: 'label',
          label: 'label'
        },
        workTypeList: [],
        statusList: []
      }
    },
    created () {
      if (this.careerId) {
        this.getCareerInfoData()
      }
      this.getComboboxList()
    },
    methods: {
      //加载静态列表
      getComboboxList () {
        this.workTypeList = getStaticMapList('work_type')
        this.statusList = getStaticMapList('status')
      },
      getCareerInfoData () {
        let _this = this
        let parameter = new Object()
        parameter.id = this.careerId
        postDataToServer('HM_RESUME_OBJECTIVE_GET', parameter).then((data) => {
          if (data.status === 0) {
            _this.careerObjectiveFormInfo = data.data_list
            if ('place_name' in _this.careerObjectiveFormInfo) {
              _this.careerObjectiveFormInfo.place_names = _this.careerObjectiveFormInfo.place_name.split('/')
            }
          }
        })
      },
      checkCareerInfoData () {
        let _this = this
        this.$refs['careerObjectiveInfoForm'].validate((valid) => {
          if (valid) {
            _this.saveCareerInfoData()
          } else {
            this.$message({
              message: '存在数据填写错误！',
              type: 'error'
            })

          }
        })
      },
      saveCareerInfoData () {
        let place_name = this.careerObjectiveFormInfo.place_names
        this.careerObjectiveFormInfo.place_name = this.careerObjectiveFormInfo.place_names.join('/')
        delete this.careerObjectiveFormInfo.place_names
        let _this = this
        let path = 'HM_RESUME_OBJECTIVE_EDIT'
        if (!this.careerId) {
          path = 'HM_RESUME_OBJECTIVE_ADD'
          this.careerObjectiveFormInfo.resume_id = this.resumeId
        }
        postDataToServer(path, this.careerObjectiveFormInfo).then((data) => {
          if (data.status === 0) {
            _this.$emit('sendEditCareerInfoStatus', 'success')
          } else {
            _this.$message.error(data.message)
            _this.careerObjectiveFormInfo.place_names = place_name
          }
        })

      },
      cancelCareerInfoEdit () {
        this.$emit('sendEditCareerInfoStatus', 'cancel')
      }
    }
  }
</script>

<style scoped>
  .btn-box {
    width: 90%;
    text-align: center;
  }
</style>
